<template>
  <div>
    <van-tabs v-model="param.status" @click="onClick">
      <van-tab title="待自提" name="1">
        <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
          <van-cell v-for="item in relults" :key="item" :title="item.id" :value="item.orderid"/>
        </van-list>
      </van-tab>
      <van-tab title="已完成" name="2">
        <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
          <van-cell v-for="item in relults" 
          :key="item" 
          :title="item.id" 
          :value="item.orderid"
          >
          <template #label>
              <span>价格 {{item.price}}</span>
          </template>
          </van-cell>
        </van-list>
      </van-tab>
    </van-tabs>
  </div>
</template>
<script>
import { orderlist } from "@/api/station";
export default {
  created() {
    this.onLoad();
  },
  data() {
    return {
      param: {
        status: 1,
        pageSize: 10,
        pageNum: 1
      },
      loading: false,
      finished: false,
      refreshing: true,
      relults: []
    };
  },
  methods: {
    onLoad() {
      if (this.refreshing) {
        this.finished = false;  
        this.relults = [];
        this.refreshing = false;
        this.param.pageNum  = 1;
      }
      this.loading = true;
      orderlist(this.param).then(response => {

        this.relults = this.relults.concat(response.data);
        if (response.data.length == 0) {
          this.finished = true;
        }
        this.param.pageNum = this.param.pageNum + 1;
        this.loading = false;
      });
    },
    onRefresh() {
   
      this.refreshing = true;
      this.onLoad();
    },
    onClick() {

      this.refreshing = true;
      this.onLoad();
    }
  }
};
</script>